<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style>
		div{
			width:50px;
			height:50px;
			background:#ccc;
		}
		.div1{
			margin-bottom:20px;
		}
		.div2{
			margin-top:30px;
		}

		.div3{
			width:100px;
			height:100px;
			background:blue;
			/* border:1px solid red; */
			margin-top:20px;
		}
		.div4{
			margin-top:30px;
		}

		p{
			margin:20px 0;
		}
	</style>
</head>
<body>
	<div class="div1">div1</div>
	<div class="div2">div2</div>
	<hr>

	<div class="div3">
		<div class="div4"></div>
	</div>
	<hr>

	<p>p1</p>
	<p>p2</p>
	<p>p3</p>
	<p>p4</p>
	<p>p5</p>
	<p>p6</p>
	<p>p7</p>
	<p>p8</p>
</body>
</html>